import {
  patient_guidance_list,
  platform_guidance_list,
  reservation_guidance_list,
} from '@/services/guide';
import age from '@/utils/age';
import { ActionType, PageContainer, ProColumns, ProTable } from '@ant-design/pro-components';
import { Button, Tabs } from 'antd';
import moment from 'moment';
import { useRef, useState } from 'react';
import InHospitalGuideInfo from './components/InHospitalGuideInfo';
import RemoteAppointmentInfo from './components/RemoteAppointmentInfo';
import RemoteGuideInfo from './components/RemoteGuideInfo';

type GithubIssueItem = {
  id: string;
  huiyuan: string;
  name: string;
  sex: string;
  plan_time: string;
  birth: string;
  create_at: string;
  idcard: string;
  create_user: string;
  address: string;
};
const GuideRecord = () => {
  const actionRef = useRef<ActionType>();
  const actionRef1 = useRef<ActionType>();
  const actionRef2 = useRef<ActionType>();
  // 院内指导详情模态框
  const [inHospitalModal, setInHospitalModal] = useState(false);
  // 存储院内指导id
  const [inHospitalId, setInHospitalId] = useState();
  // 远程指导详情模态框
  const [remoteGuideModal, setRemoteGuideModal] = useState(false);
  // 存储远程指导id
  const [remoteGuideId, setRemoteGuideId] = useState();
  // 远程预约详情模态框
  const [remoteAppointmentModal, setRemoteappointmentModal] = useState(false);
  // 存储远程预约详情id
  const [remoteAppointmentId, setRemoteAppointmentId] = useState();

  // 控制院内指导详情模态框的显示与隐藏
  const isShowInHospitalModal = (status: boolean) => {
    setInHospitalModal(status);
  };
  // 控制远程指导详情模态框的显示与隐藏
  const isShowRemoteGuideModal = (status: boolean) => {
    setRemoteGuideModal(status);
  };
  // 控制远程预约详情模态框的显示与隐藏
  const isShowRemoteappointmentModal = (status: boolean) => {
    setRemoteappointmentModal(status);
  };

  // 院内指导记录
  const get_popular_record_list = async (params: {
    pageSize?: number | undefined;
    current?: number | undefined;
    keyword?: string | undefined;
  }) => {
    //默认分页参数和后端接口字段不匹配
    let request_body = {
      ...params,
      current: params.current,
      pageSize: params.pageSize,
      status: 2,
    };
    // console.log(params);
    const res = await patient_guidance_list(request_body);
    console.log('指导记录', res);
    return {
      data: res.data.list,
      success: true,
      total: res.data.total_count,
    };
  };
  // 远程指导记录
  const get_platform_guidance_list = async (params: {
    pageSize?: number | undefined;
    current?: number | undefined;
    keyword?: string | undefined;
  }) => {
    //默认分页参数和后端接口字段不匹配
    let request_body = {
      ...params,
      current: params.current,
      pageSize: params.pageSize,
      status: 1,
    };
    // console.log(params);
    const res = await platform_guidance_list(request_body);
    console.log('远程指导记录', res);
    return {
      data: res.data.list,
      success: true,
      total: res.data.total_count,
    };
  };
  // 远程预约记录
  const get_reservation_guidance_list = async (params: {
    pageSize?: number | undefined;
    current?: number | undefined;
    keyword?: string | undefined;
  }) => {
    //默认分页参数和后端接口字段不匹配
    let request_body = {
      ...params,
      current: params.current,
      pageSize: params.pageSize,
      status: 1,
    };
    // console.log(params);
    const res = await reservation_guidance_list(request_body);
    console.log('远程预约记录', res);
    return {
      data: res.data.list,
      success: true,
      total: res.data.total_count,
    };
  };
  // 切换tab
  const changeTab = (key: string) => {
    if (key == '院内指导') {
      actionRef.current?.reload();
    } else if (key == '远程指导') {
      actionRef1.current?.reload();
    } else if (key == '远程预约') {
      actionRef2.current?.reload();
    }
  };

  // 院内指导
  const columns: ProColumns<GithubIssueItem>[] = [
    {
      title: '序号',
      dataIndex: 'index',
      valueType: 'index',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '指导账号',
      dataIndex: 'doctor_phone',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '指导医生',
      dataIndex: 'username',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '计划指导时间',
      dataIndex: 'plan_time',
      hideInSearch: true,
      align: 'center',
      render: (_, record) => moment(record.plan_time).format('YYYY-MM-DD'),
    },
    {
      title: '患者账号',
      dataIndex: 'phone',
      hideInTable: true,
      align: 'center',
    },
    {
      title: '患者姓名',
      dataIndex: 'name',
      hideInTable: true,
      align: 'center',
    },

    {
      title: '指导时间',
      dataIndex: 'guidance_time',
      hideInSearch: true,
      align: 'center',
    },

    {
      title: '指导时间',
      dataIndex: 'guidance_time',
      valueType: 'dateRange',
      colSize: 2,
      hideInTable: true,
      search: {
        transform: (value) => {
          return {
            g_start_date: value[0],
            g_end_date: value[1],
          };
        },
      },
    },
    {
      title: '患者姓名',
      dataIndex: 'patient_name',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '患者账号',
      dataIndex: 'phone',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '患者性别',
      dataIndex: 'sex',
      hideInSearch: true,
      align: 'center',
      valueEnum: {
        0: {
          text: '未知',
        },
        1: {
          text: '男',
        },
        2: {
          text: '女',
        },
      },
    },
    {
      title: '患者年龄',
      dataIndex: 'birth',
      hideInSearch: true,
      align: 'center',
      render: (_, record) => age(record.birth) + '岁',
    },
    {
      title: '操作',
      hideInSearch: true,
      align: 'center',
      render: (_: any, record: any) => (
        <>
          <Button
            key="info"
            type="link"
            onClick={() => {
              setInHospitalId(record.id);
              isShowInHospitalModal(true);
            }}
          >
            详情
          </Button>
        </>
      ),
    },
  ];

  // 远程指导
  const columns1: ProColumns<GithubIssueItem>[] = [
    {
      title: '序号',
      dataIndex: 'index',
      valueType: 'index',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '指导账号',
      dataIndex: 'guidance_phone',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '指导医生',
      dataIndex: 'username',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '预约账号',
      dataIndex: 'phone',
      hideInTable: true,
      align: 'center',
    },
    {
      title: '机构名称',
      dataIndex: 'name',
      hideInTable: true,
      align: 'center',
    },

    {
      title: '计划指导时间',
      dataIndex: 'plan_time',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '指导时间',
      dataIndex: 'actual_endtime',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '指导时间',
      dataIndex: 'actual_endtime',
      valueType: 'dateRange',
      colSize: 2,
      hideInTable: true,
      search: {
        transform: (value) => {
          return {
            guidance_start_date: value[0],
            guidance_end_date: value[1],
          };
        },
      },
    },
    {
      title: '机构名称',
      dataIndex: 'platform_name',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '预约账号',
      dataIndex: 'platform_phone',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '操作',
      hideInSearch: true,
      align: 'center',
      render: (_: any, record: any) => (
        <>
          <Button
            key="info"
            type="link"
            onClick={() => {
              isShowRemoteGuideModal(true);
              setRemoteGuideId(record.id);
            }}
          >
            详情
          </Button>
        </>
      ),
    },
  ];

  // 远程预约
  const columns2: ProColumns<GithubIssueItem>[] = [
    {
      title: '序号',
      dataIndex: 'index',
      valueType: 'index',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '指导机构',
      dataIndex: 'platform_name',
      hideInSearch: true,
      align: 'center',
    }, {
      title: '指导机构',
      dataIndex: 'name',
      hideInTable: true,
      align: 'center',
    },
    {
      title: '指导账号',
      dataIndex: 'platform_phone',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '指导医生',
      dataIndex: 'username',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '计划指导时间',
      dataIndex: 'plan_time',
      hideInSearch: true,
      align: 'center',
    },
    {
      title: '指导时间',
      dataIndex: 'actual_endtime',
      hideInSearch: true,
      align: 'center',
    },

    {
      title: '指导时间',
      dataIndex: 'actual_endtime',
      valueType: 'dateRange',
      colSize: 2,
      hideInTable: true,
      search: {
        transform: (value) => {
          return {
            guidance_start_date: value[0],
            guidance_end_date: value[1],
          };
        },
      },
    },
    {
      title: '操作',
      hideInSearch: true,
      align: 'center',
      render: (_: any, record: any) => (
        <>
          <Button
            key="info"
            type="link"
            onClick={() => {
              isShowRemoteappointmentModal(true);
              setRemoteAppointmentId(record.id);
            }}
          >
            详情
          </Button>
        </>
      ),
    },
  ];
  return (
    <PageContainer breadcrumb={false}>
      <Tabs
        defaultActiveKey="院内指导"
        onChange={changeTab}
        items={[
          {
            key: '院内指导',
            label: '院内指导',
            children: (
              <ProTable<GithubIssueItem>
                columns={columns}
                actionRef={actionRef}
                cardBordered
                request={async (params = {}) => get_popular_record_list(params)}
                editable={{
                  type: 'multiple',
                }}
                rowKey={(record) => record.id}
                search={{
                  labelWidth: 'auto',
                  collapseRender: false,
                  collapsed: false,
                  span: 4,
                }}
                options={{
                  setting: {
                    listsHeight: 400,
                  },
                }}
                pagination={{
                  pageSize: 10,
                }}
                dateFormatter="string"
                headerTitle="院内指导记录列表"
              />
            ),
          },
          {
            key: '远程指导',
            label: '远程指导',
            children: (
              <ProTable<GithubIssueItem>
                columns={columns1}
                actionRef={actionRef1}
                cardBordered
                request={async (params, sort, filter) => get_platform_guidance_list(params)}
                editable={{
                  type: 'multiple',
                }}
                rowKey={(record) => record.id}
                search={{
                  labelWidth: 'auto',
                  collapseRender: false,
                  collapsed: false,
                  span: 4,
                }}
                options={{
                  setting: {
                    listsHeight: 400,
                  },
                }}
                pagination={{
                  pageSize: 10,
                }}
                dateFormatter="string"
                headerTitle="远程指导记录列表"
              />
            ),
          },
          {
            key: '远程预约',
            label: '远程预约',
            children: (
              <ProTable<GithubIssueItem>
                columns={columns2}
                actionRef={actionRef2}
                cardBordered
                request={async (params, sort, filter) => get_reservation_guidance_list(params)}
                editable={{
                  type: 'multiple',
                }}
                rowKey={(record) => record.id}
                search={{
                  labelWidth: 'auto',
                  collapseRender: false,
                  collapsed: false,
                  span: 4,
                }}
                options={{
                  setting: {
                    listsHeight: 400,
                  },
                }}
                pagination={{
                  pageSize: 10,
                }}
                dateFormatter="string"
                headerTitle="远程预约记录列表"
              />
            ),
          },
        ]}
      />
      {/* 院内指导详情模态框 */}
      {inHospitalModal ? (
        <InHospitalGuideInfo
          inHospitalModal={inHospitalModal}
          isShowInHospitalModal={isShowInHospitalModal}
          inHospitalId={inHospitalId}
        ></InHospitalGuideInfo>
      ) : (
        ''
      )}
      {/* 远程指导详情模态框 */}
      {remoteGuideModal ? (
        <RemoteGuideInfo
          remoteGuideModal={remoteGuideModal}
          isShowRemoteGuideModal={isShowRemoteGuideModal}
          remoteGuideId={remoteGuideId}
        ></RemoteGuideInfo>
      ) : (
        ''
      )}
      {/* 远程预约详情模态框 */}
      {remoteAppointmentModal ? (
        <RemoteAppointmentInfo
          remoteAppointmentModal={remoteAppointmentModal}
          isShowRemoteappointmentModal={isShowRemoteappointmentModal}
          remoteAppointmentId={remoteAppointmentId}
        ></RemoteAppointmentInfo>
      ) : (
        ''
      )}
    </PageContainer>
  );
};
export default GuideRecord;
